﻿<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
    <title>志愿者招募平台登录注册页</title>
    <link rel="stylesheet" href="user/bootstrap-3.4.1-dist/css/style.css">
</head>
<body>


    <div class="container">
        <div class="forms-container">
            <div class="signin-signup">
                <form action="/Volunteer/LoginServlet" method="post" class="sign-in-form"> 
                    <h2 class="title">登录</h2>
                    <div class="input-field">
                        <i class="fas fa-user"></i>
                        <input type="text" name="username" placeholder="用户名" />
                    </div>
                    <div class="input-field">
                        <i class="fas fa-lock"></i>
                        <input type="password" name="password" placeholder="密码" />
                    </div>
                     
                    <div>
                        身份：
                        <input type="radio" name="place" value="0" checked="checked">志愿者&nbsp;&nbsp;&nbsp; 
                        <input type="radio" name="place" value="1" checked="checked">院级管理员&nbsp;&nbsp;&nbsp;
                        <input type="radio" name="place" value="2" checked="checked">校级管理员
                    </div>
                    <button class="btn solid">登录</button>
                    <p class="social-text">或者使用第三方账号登录</p>
                    <div class="social-media">
                        <a href="#" class="social-icon">
                            <i class="fab fa-facebook-f"></i>
                        </a>
                        <a href="#" class="social-icon">
                            <i class="fab fa-twitter"></i>
                        </a>
                        <a href="#" class="social-icon">
                            <i class="fab fa-google"></i>
                        </a>
                        <a href="#" class="social-icon">
                            <i class="fab fa-linkedin-in"></i>
                        </a> 
                    </div>
                </form>
                <form action="/Volunteer/RegisterServlet" class="sign-up-form">
                    <h2 class="title">注册</h2>
                    <div class="input-field">
                        <i class="fas fa-user"></i>
                        <input type="text" name="name" placeholder="用户名" />
                    </div>
                    <div class="input-field">
                        <i class="fas fa-envelope"></i>
                        <input type="tel" name="telephone" placeholder="电话号码" />
                    </div>
                    <div class="input-field">
                        <i class="fas fa-lock"></i>
                        <input type="password" name="password" placeholder="密码" />
                    </div>
                    <div class="input-field">
                        <i class="fa fa-address-card-o"></i>
                        <input type="text" name="uclass" placeholder="院系" />
                    </div>
                    <div>
                        性别：
                        <input type="radio" name="sex" value="1" checked="checked">男&nbsp;&nbsp;&nbsp; 
                        <input type="radio" name="sex" value="0" checked="checked">女&nbsp;&nbsp;&nbsp;
                    </div>
                    <div>
                        身份：
                        <input type="radio" name="ident" value="0" checked="checked">志愿者&nbsp;&nbsp;&nbsp; 
                        <input type="radio" name="ident" value="1" checked="checked">院级管理员&nbsp;&nbsp;&nbsp;
                        <input type="radio" name="ident" value="2" checked="checked">校级管理员
                    </div>
                    <input type="submit" class="btn" value="注册" />
                    <p class="social-text">或者使用第三方账号登录</p>
                    <div class="social-media">
                        <a href="#" class="social-icon">
                            <i class="fab fa-facebook-f"></i>
                        </a>
                        <a href="#" class="social-icon">
                            <i class="fab fa-twitter"></i>
                        </a>
                        <a href="#" class="social-icon">
                            <i class="fab fa-google"></i>
                        </a>
                        <a href="#" class="social-icon">
                            <i class="fab fa-linkedin-in"></i>
                        </a>
                    </div>
                </form>
            </div>
        </div>
        <div class="panels-container">
            <div class="panel left-panel">
                <div class="content">
                    <h3>您想加入大连东软信息学院志愿者队伍？</h3>
                    <p>
                        请点击下方注册按钮即可。
                        大连东软信息学院志愿者队伍欢迎您的到来。
                    </p>
                    <button class="btn transparent" id="sign-up-btn">
                        注册
                    </button>
                </div>
                <img src="img/log.svg" class="image" alt="" />
            </div>
            <div class="panel right-panel">
                <div class="content">
                    <h3>您已经是大连东软信息学院志愿者队伍的一员了？</h3>
                    <p>
                        请点击这里直接登录。
                    </p>
                    <button class="btn transparent" id="sign-in-btn">
                        登录
                    </button>
                </div>
                <img src="img/register.svg" class="image" alt="" />
            </div>
        </div>
    </div>

    <script src='https://kit.fontawesome.com/64d58efce2.js'></script>
    <script src="user/bootstrap-3.4.1-dist/js/script.js"></script>
</body>
</html>
